{% extends "index.html" %}

{% load permission_tags %}
{% load helper_tags %}
{% load item_tags %}

{% block scripts %}
	<script type="text/javascript" src="{{ STATIC_URL }}scripts/libs/jquery.expander.js"></script>
	<script type="text/javascript" charset="utf-8">
		$(document).ready(function() {
			$( ".document_list" ).accordion({
					autoHeight: false,
					navigation: true,
					collapsible: true,
					active: false
			});
			
			//TODO: BETTER EXPANDER (only one line)
			$(".spoiler").expander({
				    slicePoint:       30,
				    expandPrefix:     ' ',
				    expandText:       '[...]',
				    userCollapseText: '[^]'
			});
			
			$('.hint').tooltip({
				position: 'top center',
				effect: 'fade'
			});
			
			// make sure menus in button bars 
			$('html').click(function() {
				$('.buttonbar li ul').fadeOut();
			});
			$('.buttonbar li').click(function(event){
				event.stopPropagation();
			});
			
		});
	</script>
{% endblock %}

{% block inline_navi %}
    <a href="{% url documents.views.index %}">
    	Dokumente
   	</a>
   	&nbsp;>&nbsp;
   	<a href="{% url documents.views.modulelist module_term.module.faculty.id %}">
   		{{ module_term.module.faculty }}
   	</a>
   	&nbsp;>&nbsp;
   	{{ module_term.module.name }}  ({{ module_term.lecturer.last_name }} - {{ module_term.semester }})
{% endblock %}

{% block box_title %}
	{{ module_term.module }} ({{ module_term.lecturer.last_name }} - {{ module_term.semester }})
{% endblock %}
{% block box_content %}
	<ul class="buttonbar">
		<li>
			<a class="button add" href="{% url documents.views.add_module_part module_term.id %}">
		    	Da fehlt eine Kategorie
		    </a>
	    </li>
    {% requiresobjectpermission 'documents.delete_moduleterm' module_term %}
	    <li>
	    	<a class="button delete" href="{% url documents.views.delete_module_term module_term.id %}">
	    		Semester löschen
	    	</a>
    	</li>
	{% endrequiresobjectpermission %}
	{% requiresobjectpermission 'documents.change_moduleterm' module_term %}
		<li>
	    	<a class="button change" href="{% url documents.views.change_module_term module_term.id %}">
	    		Semester verändern
	    	</a>
    	</li>
	{% endrequiresobjectpermission %}
	</ul>
    {% for module_part, documents in item_list %}
        <div class="box">
            <h2>
            	{{ module_part.name }}
            </h2>
            
			<div class="module_part">
				<ul class="buttonbar">
					<li>
						<a class="button question" href="{% url documents.views.add_document module_part.id module_term.id %}">
		            		Ich brauche Material zu einer Lerneinheit
		    			</a>
	    			</li>
	    			<li>
		            	<a class="button add" onclick="$('#item_types_module_part_{{ module_part.id }}').fadeToggle()">
		            		Ich habe Material zu einer Lerneinheit
		            	</a>
		            	<ul id="item_types_module_part_{{ module_part.id }}">
	                    	{% for item_type in item_types %}
	                    		<li>{% add_document_item item_type module_part module_term %}</li>
	                    	{% endfor %}
                    	</ul>
	            	</li>
					{% requiresobjectpermission 'documents.delete_modulepart' module_part %}
						<li>
					    	<a class="button delete" href="{% url documents.views.delete_module_part module_part.id module_term.id %}">
					    		Kategorie löschen
					    	</a>
				    	</li>
					{% endrequiresobjectpermission %}
					{% requiresobjectpermission 'documents.change_modulepart' module_part %}
						<li>
					    	<a class="button change" href="{% url documents.views.change_module_part module_part.id module_term.id %}">
					    		Kategorie umbenennen
					    	</a>
				    	</li>
					{% endrequiresobjectpermission %}
            	</ul>
            	
	            <div class="document_list">
	                {% for document, last_date, items in documents %}
	                    <h3 class="{% if not items %}ui-state-error{% endif %}" {% if not items %}title="Noch kein Item vorhanden"{% endif %}>
	                    	<a href="#{{ document.name }}">
	                    		{{ document.name }}
	                    		<span class="status">
                   					{% if last_date %}
                   						{{ last_date|naturalTimeDifference }}
                   					{% endif %}
		                    		{% if not items %}
		                    			<div class="missing"></div>
		                    		{% endif %}
	                    		</span>
	                    	</a>
	                    </h3>
	                    <div>
	                    	<ul class="buttonbar">
	                    		<li>
			                    	<a class="button add" onclick="$('#item_types_document_{{ document.id }}').fadeToggle()">
			                    		Ich habe eine Version
			                    	</a>
			                    	<ul id="item_types_document_{{ document.id }}">
				                    	{% for item_type in item_types %}
				                    		<li>{% add_item item_type document %}</li>
				                    	{% endfor %}
			                    	</ul>
		                    	</li>
		                    	{% requiresobjectpermission 'documents.delete_document' document %}
			                    	<li>
				                    	<a class="button delete" href="{% url documents.views.delete_document document.id %}">
				                    		Löschen
				                    	</a>
			                    	</li>
		                    	{% endrequiresobjectpermission %}
		                    	{% requiresobjectpermission 'documents.change_document' document %}
			                    	<li>
				                    	<a class="button change" href="{% url documents.views.change_document document.id %}">
				                    		Ändern
				                    	</a>
			                    	</li>
		                    	{% endrequiresobjectpermission %}
	                    	</ul>
	                    	<p>
	                    		{{ document.description|linebreaksbr }}
	                    		<div class="tags">
		                    		<ul>
			                    		{% for tag in document.tags.all %}
											<li>{{tag}}</li>
										{% endfor %}
		                    		</ul>
	                    		</div>
	                    	</p>
	                        <ul class="item_list">
	                            {% for item in items %}
	                                {% show_item item %}
	                            {% endfor %}
	                        </ul>
	                    </div>
	                {% endfor %}
	             
	            </div>
            </div>
        </div>
    {% endfor %}
{% endblock %}
